<template>
  <!-- <wd-icon name="star-on" size="22px"></wd-icon> -->
  <icon-box :name="modelValue ? 'star-on' : 'star'"
    :text-class="modelValue ? 'text-base text-[18rpx]' : 'text-[#9A9A9A] text-[18rpx]'"
    @click="handleCollect"></icon-box>
</template>
<script setup>
import { http } from '@/utils/http'
import { showToast } from "@/utils/uni";
const props = defineProps({
  modelValue: {
    type: [Number, Boolean],
    default: 0
  },
  api: {
    type: [String, Function],
    default: ''
  },
  params: {
    type: Object,
  }
})
const emit = defineEmits(['update:modelValue']);

function handleCollect() {
  http.post(props.api, props.params).then(res => {
    emit('update:modelValue', !props.modelValue);
    showToast(res.msg);
  })
}

</script>
<style lang="scss" scoped></style>
